<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="../../Templates/SubFolderTemplate.xhtml"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core">
    <ui:define name="head-title">
        <title>View Sale Figure | Merlion's ERP System</title>
    </ui:define>
    
    <ui:define name="content">
        
        <f:view beforePhase="#{viewSaleFigureManagerBean.initView}">
            <p:panel id="panel" header="View Sale Figures">
                <p:ajaxStatus style="width:16px;height:16px;">   
                    <f:facet name="start">   
                        <p:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" /> 
                    </f:facet> 

                    <f:facet name="complete">   
                        <h:outputText value="" />   
                    </f:facet>   
                </p:ajaxStatus> 

                <p:messages />
                <h:form id="formMain" prependId="false">
                    <h:outputLabel for="salefigureyear" style="font-weight: bold" value="Select Year: " /> 
                    <h:selectOneMenu id="salefigureyear" value="#{viewSaleFigureManagerBean.saleFigureYear}">
                        <f:selectItems value ="#{viewSaleFigureManagerBean.saleFigureYears}"/>
                    </h:selectOneMenu>
                    <span> </span><p:commandButton id="retrieve" value="Retrieve Data" update="panel" actionListener="#{viewSaleFigureManagerBean.retrieveData(event)}" ajax="true" />
                    <br/><br/>



                    <p:dataTable var="month" value="#{viewSaleFigureManagerBean.monthlySaleFigures}" paginator="false" rows="12" selection="#{viewSaleFigureManagerBean.selectedMonthlySaleFigure}">  
                        <f:facet name="header">
                            List of Monthly Sale Figure
                        </f:facet>
                        
                        <p:column selectionMode="single" />  

                        <p:column headerText="Month">  
                            <h:outputText value="#{viewSaleFigureManagerBean.getMonth(month.saleFigureMonth)}" />  
                        </p:column>  

                        <p:column headerText="Total Product">  
                            <h:outputText value="#{month.totalProductCaseQuantity}" />  
                        </p:column>  

                        <f:facet name="footer">  
                            <p:commandButton value="View Details" update="display1" oncomplete="saleFigureDialog.show()">
                                <f:attribute name="selectedMonthlySaleFigure" value="#{month}"/>
                            </p:commandButton>     
                            <p:commandButton value ="Edit" update="display2 table2" oncomplete="editSaleFigureDialog.show()">
                                <f:attribute name="selectedMonthlySaleFigure" value="#{month}"/>
                            </p:commandButton>
                        </f:facet>
                    </p:dataTable>

                </h:form>
                
                <h:form id="formViewDialog" prependId="false">
                    <p:dialog header="Sale Figure Details" widgetVar="saleFigureDialog" resizable="false" 
                              width="600" showEffect="clip" hideEffect="clip">
                        <p:panel id="display1">
                            <p:dataTable id="table" var="lineItem" value="#{viewSaleFigureManagerBean.selectedMonthlySaleFigure.saleFigureLineItems}" dynamic="true" paginator="false" emptyMessage="No Line Item in the database.">
                                
                                <p:column headerText="Product Type">
                                    <h:outputText value="#{lineItem.product.productType}"/>
                                </p:column>

                                <p:column headerText="Quantity">
                                    <h:outputText value="#{lineItem.quantityInCases} case(s)"/>
                                </p:column>

                                <p:column headerText="Promotion Quantity">
                                    <h:outputText value="#{lineItem.promotionQuantityInCases} case(s)"/>
                                </p:column>

                                <p:column headerText="Total Quantity">
                                    <h:outputText value="#{lineItem.totalQuantityInCases} case(s)"/>
                                </p:column>
                            </p:dataTable>
                        </p:panel>
                    </p:dialog>
                </h:form>

                <h:form id="formEditDiaglog" prependId="false">
                    <p:dialog header="Edit Sale Figure" widgetVar="editSaleFigureDialog" resizable="false"
                              width="600" showEffect="clip" hideEffect="clip">
                        <p:panel id="display2">
                            <p:ajaxStatus style="width:16px;height:16px;">   
                                <f:facet name="start">   
                                    <p:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" /> 
                                </f:facet> 

                                <f:facet name="complete">   
                                    <h:outputText value="" />   
                                </f:facet>   
                            </p:ajaxStatus> 

                            <p:messages />
                            <h:outputText value="Month ID:"/>
                            <h:outputText value="#{viewSaleFigureManagerBean.selectedMonthlySaleFigure.id}"/>
                            <p:dataTable id ="table2" var="sflineItem" value="#{viewSaleFigureManagerBean.selectedMonthlySaleFigure.saleFigureLineItems}" dynamic="true" paginator="false" emptyMessage="No Line Item in the database.">
                                
                                <p:column headerText="Product Type">
                                    <h:outputText value="#{sflineItem.product.productType}"/>
                                </p:column>

                                <p:column headerText="Quantity (case(s))">
                                    <p:inputText value="#{sflineItem.quantityInCases}" required="true" requiredMessage="Quantity is requred." id="qty" validator="#{viewSaleFigureManagerBean.validateQuantity}"/>
                                </p:column>
                                <p:message for="qty" /> 
                                
                                <p:column headerText="Promotion Quantity (case(s))">
                                    <p:inputText value="#{sflineItem.promotionQuantityInCases}" required="true" requiredMessage="Promotion Quantity is requred." id="promotionqty" validator="#{viewSaleFigureManagerBean.validateQuantity}"/>
                                </p:column>
                                <p:message for="promotionqty" /> 
                                
                                <f:facet name="footer">
                                    <p:commandButton id="btn" value="Update Sale Figure" update="panel" actionListener="#{viewSaleFigureManagerBean.updateSaleFigure(event)}" ajax="true"/>
                                </f:facet>
                            </p:dataTable>
                        </p:panel>
                    </p:dialog>
                </h:form>

            </p:panel>
        </f:view>
    
    </ui:define>

</ui:composition>
